<template>
	<view class="flex-row" style="justify-content: space-around;">
		<view v-for="(item,index) in list" :key="index">
			<view @click='btnClick(index)' class="column-levelCenter">
				<image :src="item.icon" style="width: 40px; height: 40px; margin-bottom: 8px;" mode=""></image>
				<view class="">
					{{item.title}}
				</view>
				<button v-if="index==1" open-type="share" class="shareFriends"></button>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		name: "btns-view",
		data() {
			return {
				list: [
					{
						title: '返回首页',
						icon: 'https://mp-c258dd3d-c508-4784-b2f5-c85e1be8c0cc.cdn.bspapp.com/appImages/首页.png'
					
					},
					{
						title: '分享好友',
						icon: 'https://mp-35bd1c1b-8095-44b6-b494-c65e6d85fd9c.cdn.bspapp.com/appConfigure/weixin_icon.png'

					},
					{
						title: '分享朋友圈',
						icon: 'https://mp-35bd1c1b-8095-44b6-b494-c65e6d85fd9c.cdn.bspapp.com/appConfigure/朋友圈.png'

					}
					
				]
			};
		},
		methods: {
			btnClick(index) {				if (index == 1) {
					return
				}
				this.$emit('btnsClick', {
					'index': index
				})
			}
		}

	}
</script>

<style lang="scss" scoped>
	.shareFriends {
		position: absolute;
		width: 100px;
		height: 80px;
		/* 按钮高度 */
		background-color: rgba(0, 0, 0, 0);
		/* 按钮背景颜色 */

		// border: none; /* 移除边框 */
		border: 1px solid rgba(0, 0, 0, 0);
		box-shadow: none;
		/* 移除阴影 */

		opacity: 0;
		/* 完全不可见，不推荐 */
	}
</style>